<div class="bg-light lter b-b wrapper-md">
  <h1 class="m-n font-thin h3">Developer Tools: Toaster</h1>
</div>
<div class="wrapper-md" ng-controller="ToasterDemoCtrl">
	<div class="col-md-12  panel panel-default">
	  <div class="row">
	    <div class="col-sm-6">
	      <div class="form-group">
	        <label>Title</label>
	        <input type="text" class="form-control" placeholder="Enter a title..." ng-model="toaster.title" autocomplete="off">
	      </div>
	
	      <div class="form-group">
	        <label>Message</label>
	        <textarea class="form-control" placeholder="Enter a message" rows="5" ng-model="toaster.text"></textarea>
	      </div>
	    </div>
	    <div class="col-sm-6">
	      <label>Toast Type</label>
	      <div class="radio">
	        <label class="i-checks">
	          <input type="radio" name="toasts" ng-model="toaster.type" value="success">
	          <i></i>
	          Success
	        </label>
	      </div>
	      <div class="radio">
	        <label class="i-checks">
	          <input type="radio" name="toasts" ng-model="toaster.type" value="info">
	          <i></i>
	          Info
	        </label>
	      </div>
	      <div class="radio">
	        <label class="i-checks">
	          <input type="radio" name="toasts" ng-model="toaster.type" value="wait">
	          <i></i>
	          Wait
	        </label>
	      </div>
	      <div class="radio">
	        <label class="i-checks">
	          <input type="radio" name="toasts" ng-model="toaster.type" value="warning">
	          <i></i>
	          Warning
	        </label>
	      </div>
	      <div class="radio">
	        <label class="i-checks">
	          <input type="radio" name="toasts" ng-model="toaster.type" value="error">
	          <i></i>
	          Error
	        </label>
	      </div>
	    </div>
	  </div>
	
	  <button class="btn btn-info" ng-click="pop()">Show a Toaster</button>
	  <br><br><br>
	</div>
</div>